<html>
<head>
<title>day11-作业-实现12306车次查询.ets</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
.s0 { color: #52cb54;}
.s1 { color: #a9b7c6;}
.s2 { color: #faa23d;}
.s3 { color: #e2da90;}
.s4 { color: #bbb529;}
.s5 { color: #db7e9b;}
.s6 { color: #b3e54c;}
.s7 { color: #aa7dfc;}
</style>
</head>
<body bgcolor="#2b2b2b">
<table CELLSPACING=0 CELLPADDING=5 COLS=1 WIDTH="100%" BGCOLOR="#606060" >
<tr><td><center>
<font face="Arial, Helvetica" color="#000000">
day11-作业-实现12306车次查询.ets</font>
</center></td></tr></table>
<pre><span class="s0">// 火车数据（只是渲染，不需要修改）</span>
<span class="s1">interface iTicketData </span><span class="s2">{</span>
  <span class="s1">id</span><span class="s3">: </span><span class="s1">number</span>
  <span class="s1">beginTime</span><span class="s3">: </span><span class="s1">string </span><span class="s0">//结束时间</span>
  <span class="s1">endTime</span><span class="s3">: </span><span class="s1">string </span><span class="s0">//开始时间</span>
  <span class="s1">totalTime</span><span class="s3">: </span><span class="s1">string </span><span class="s0">//总耗时</span>
  <span class="s1">TNum</span><span class="s3">: </span><span class="s1">string </span><span class="s0">//车次</span>
  <span class="s1">beginStation</span><span class="s3">: </span><span class="s1">string </span><span class="s0">//起始站点</span>
  <span class="s1">endStation</span><span class="s3">: </span><span class="s1">string </span><span class="s0">//终点站点</span>
  <span class="s1">price</span><span class="s3">: </span><span class="s1">number </span><span class="s0">//售价</span>
<span class="s2">}</span>

<span class="s4">@</span><span class="s1">Observed</span>
<span class="s0">// 筛选条件数据</span>
<span class="s1">export class AddressModel </span><span class="s2">{</span>
  <span class="s1">id</span><span class="s3">: </span><span class="s1">number</span>
  <span class="s1">text</span><span class="s3">: </span><span class="s1">string</span>
  <span class="s1">isSelected</span><span class="s3">: </span><span class="s1">boolean</span>

  <span class="s1">constructor</span><span class="s5">(</span><span class="s1">id</span><span class="s3">: </span><span class="s1">number</span><span class="s3">, </span><span class="s1">text</span><span class="s3">: </span><span class="s1">string</span><span class="s3">, </span><span class="s1">isSelected</span><span class="s3">: </span><span class="s1">boolean</span><span class="s5">) </span><span class="s2">{</span>
    <span class="s1">this</span><span class="s3">.</span><span class="s1">id </span><span class="s3">= </span><span class="s1">id</span>
    <span class="s1">this</span><span class="s3">.</span><span class="s1">text </span><span class="s3">= </span><span class="s1">text</span>
    <span class="s1">this</span><span class="s3">.</span><span class="s1">isSelected </span><span class="s3">= </span><span class="s1">isSelected </span><span class="s0">//选中</span>
  <span class="s2">}</span>
<span class="s2">}</span>


<span class="s4">@</span><span class="s1">Entry</span>
<span class="s4">@</span><span class="s1">Component</span>
<span class="s1">struct Index </span><span class="s2">{</span>
  <span class="s0">// 准备出发站点数据</span>
  <span class="s4">@</span><span class="s1">State</span>
  <span class="s1">beginList</span><span class="s3">: </span><span class="s1">AddressModel</span><span class="s5">[] </span><span class="s3">= </span><span class="s5">[</span>
    <span class="s1">new AddressModel</span><span class="s5">(</span><span class="s6">1</span><span class="s3">, </span><span class="s7">'广州南'</span><span class="s3">, </span><span class="s1">false</span><span class="s5">)</span><span class="s3">,</span>
    <span class="s1">new AddressModel</span><span class="s5">(</span><span class="s6">2</span><span class="s3">, </span><span class="s7">'广州东'</span><span class="s3">, </span><span class="s1">false</span><span class="s5">)</span><span class="s3">,</span>
    <span class="s1">new AddressModel</span><span class="s5">(</span><span class="s6">3</span><span class="s3">, </span><span class="s7">'新塘'</span><span class="s3">, </span><span class="s1">false</span><span class="s5">)</span><span class="s3">,</span>
    <span class="s1">new AddressModel</span><span class="s5">(</span><span class="s6">4</span><span class="s3">, </span><span class="s7">'广州白云'</span><span class="s3">, </span><span class="s1">false</span><span class="s5">)</span><span class="s3">,</span>
    <span class="s1">new AddressModel</span><span class="s5">(</span><span class="s6">5</span><span class="s3">, </span><span class="s7">'广州'</span><span class="s3">, </span><span class="s1">false</span><span class="s5">)</span><span class="s3">,</span>
    <span class="s1">new AddressModel</span><span class="s5">(</span><span class="s6">6</span><span class="s3">, </span><span class="s7">'广州北'</span><span class="s3">, </span><span class="s1">false</span><span class="s5">)</span>
  <span class="s5">]</span>
  <span class="s4">@</span><span class="s1">State NewbeginList</span><span class="s3">: </span><span class="s1">string</span><span class="s5">[] </span><span class="s3">= </span><span class="s5">[]</span>

  <span class="s1">build</span><span class="s5">() </span><span class="s2">{</span>
    <span class="s1">Column</span><span class="s5">() </span><span class="s2">{</span>
      <span class="s0">// 选中条件显示</span>
      <span class="s1">Row</span><span class="s5">() </span><span class="s2">{</span>
        <span class="s1">Text</span><span class="s5">(</span><span class="s7">'您选中的条件：'</span><span class="s5">)</span>
        <span class="s1">Text</span><span class="s5">(</span><span class="s1">this</span><span class="s3">.</span><span class="s1">NewbeginList</span><span class="s3">.</span><span class="s1">join</span><span class="s5">(</span><span class="s7">','</span><span class="s5">))</span>
      <span class="s2">}</span>
      <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s7">'100%'</span><span class="s5">)</span>
      <span class="s3">.</span><span class="s1">margin</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">top</span><span class="s3">: </span><span class="s6">10</span><span class="s3">, </span><span class="s1">left</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">)</span>

      <span class="s0">// 出发和达到站搜索条件区域</span>
      <span class="s1">Row</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">space</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">) </span><span class="s2">{</span>
        <span class="s1">Scroll</span><span class="s5">() </span><span class="s2">{</span>
          <span class="s1">Row</span><span class="s5">() </span><span class="s2">{</span>
            <span class="s0">// 出发</span>
            <span class="s1">ForEach</span><span class="s5">(</span><span class="s1">this</span><span class="s3">.</span><span class="s1">beginList</span><span class="s3">, </span><span class="s5">(</span><span class="s1">item</span><span class="s3">: </span><span class="s1">AddressModel</span><span class="s3">, </span><span class="s1">index</span><span class="s3">: </span><span class="s1">number</span><span class="s5">) </span><span class="s3">=&gt; </span><span class="s2">{</span>
              <span class="s0">// 给clickHander传数据的时候，记得使用箭头函数包括起来，这样this不会改变</span>
              <span class="s1">filterItemComp</span><span class="s5">(</span><span class="s2">{</span>
                <span class="s1">itemDate</span><span class="s3">: </span><span class="s1">item</span><span class="s3">,</span>
                <span class="s1">onAdd</span><span class="s3">: </span><span class="s5">() </span><span class="s3">=&gt; </span><span class="s2">{</span>
                  <span class="s1">item</span><span class="s3">.</span><span class="s1">isSelected </span><span class="s3">= !</span><span class="s1">item</span><span class="s3">.</span><span class="s1">isSelected</span>
                  <span class="s1">this</span><span class="s3">.</span><span class="s1">NewbeginList </span><span class="s3">= </span><span class="s1">this</span><span class="s3">.</span><span class="s1">beginList</span><span class="s3">.</span><span class="s1">filter</span><span class="s5">((</span><span class="s1">item</span><span class="s5">) </span><span class="s3">=&gt; </span><span class="s2">{</span>
                    <span class="s1">return item</span><span class="s3">.</span><span class="s1">isSelected</span>
                  <span class="s2">}</span><span class="s5">)</span><span class="s3">.</span><span class="s1">map</span><span class="s5">((</span><span class="s1">item</span><span class="s5">) </span><span class="s3">=&gt; </span><span class="s2">{</span>
                    <span class="s1">return item</span><span class="s3">.</span><span class="s1">text</span>
                  <span class="s2">}</span><span class="s5">)</span>

                <span class="s2">}</span>
              <span class="s2">}</span><span class="s5">)</span>
            <span class="s2">}</span><span class="s5">)</span>

          <span class="s2">}</span>
        <span class="s2">}</span>
        <span class="s3">.</span><span class="s1">scrollable</span><span class="s5">(</span><span class="s1">ScrollDirection</span><span class="s3">.</span><span class="s1">Horizontal</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">scrollBar</span><span class="s5">(</span><span class="s1">BarState</span><span class="s3">.</span><span class="s1">Off</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">layoutWeight</span><span class="s5">(</span><span class="s6">1</span><span class="s5">)</span>
      <span class="s2">}</span>
      <span class="s3">.</span><span class="s1">margin</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">top</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">)</span>

      <span class="s0">//   车站列表</span>
      <span class="s1">listComp</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">keyWord</span><span class="s3">: </span><span class="s1">this</span><span class="s3">.</span><span class="s1">NewbeginList </span><span class="s2">}</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">layoutWeight</span><span class="s5">(</span><span class="s6">1</span><span class="s5">)</span>

    <span class="s2">}</span>
    <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s7">'100%'</span><span class="s5">)</span>
    <span class="s3">.</span><span class="s1">height</span><span class="s5">(</span><span class="s7">'100%'</span><span class="s5">)</span>
    <span class="s3">.</span><span class="s1">backgroundColor</span><span class="s5">(</span><span class="s7">'rgba(0,0,0,0.05)'</span><span class="s5">)</span>

  <span class="s2">}</span>
<span class="s2">}</span>

<span class="s4">@</span><span class="s1">Component</span>
<span class="s1">export struct filterItemComp </span><span class="s2">{</span>
  <span class="s4">@</span><span class="s1">Prop itemDate</span><span class="s3">: </span><span class="s1">AddressModel</span>
  <span class="s1">onAdd </span><span class="s3">= </span><span class="s5">() </span><span class="s3">=&gt; </span><span class="s2">{</span>

  <span class="s2">}</span>

  <span class="s1">build</span><span class="s5">() </span><span class="s2">{</span>
    <span class="s1">Column</span><span class="s5">() </span><span class="s2">{</span>
      <span class="s0">// Text(JSON.stringify(this.addressData))</span>
      <span class="s1">Text</span><span class="s5">(</span><span class="s1">this</span><span class="s3">.</span><span class="s1">itemDate</span><span class="s3">.</span><span class="s1">text</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">height</span><span class="s5">(</span><span class="s6">30</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">border</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">width</span><span class="s3">: </span><span class="s6">1</span><span class="s3">, </span><span class="s1">color</span><span class="s3">: </span><span class="s1">this</span><span class="s3">.</span><span class="s1">itemDate</span><span class="s3">.</span><span class="s1">isSelected </span><span class="s3">? </span><span class="s7">'#0094ff' </span><span class="s3">: </span><span class="s7">'#fff' </span><span class="s2">}</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">padding</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">left</span><span class="s3">: </span><span class="s6">15</span><span class="s3">, </span><span class="s1">right</span><span class="s3">: </span><span class="s6">15 </span><span class="s2">}</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">margin</span><span class="s5">(</span><span class="s6">5</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">borderRadius</span><span class="s5">(</span><span class="s6">10</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">backgroundColor</span><span class="s5">(</span><span class="s1">Color</span><span class="s3">.</span><span class="s1">White</span><span class="s5">)</span>
        <span class="s3">.</span><span class="s1">onClick</span><span class="s5">(() </span><span class="s3">=&gt; </span><span class="s2">{</span>

          <span class="s1">this</span><span class="s3">.</span><span class="s1">onAdd</span><span class="s5">()</span>
        <span class="s2">}</span><span class="s5">)</span>
    <span class="s2">}</span>
  <span class="s2">}</span>
<span class="s2">}</span>

<span class="s4">@</span><span class="s1">Component</span>
<span class="s1">export struct listComp </span><span class="s2">{</span>
  <span class="s0">// 原始数据，不要直接修改，基于他进行筛选</span>
  <span class="s1">sourceData</span><span class="s3">: </span><span class="s1">iTicketData</span><span class="s5">[] </span><span class="s3">= </span><span class="s5">[</span>
    <span class="s2">{</span>
      <span class="s1">id</span><span class="s3">: </span><span class="s6">1</span><span class="s3">,</span>
      <span class="s1">beginTime</span><span class="s3">: </span><span class="s7">'15:05'</span><span class="s3">,</span>
      <span class="s1">endTime</span><span class="s3">: </span><span class="s7">'15:36'</span><span class="s3">,</span>
      <span class="s1">totalTime</span><span class="s3">: </span><span class="s7">'31分'</span><span class="s3">,</span>
      <span class="s1">TNum</span><span class="s3">: </span><span class="s7">'G319'</span><span class="s3">,</span>
      <span class="s1">beginStation</span><span class="s3">: </span><span class="s7">'广州南'</span><span class="s3">,</span>
      <span class="s1">endStation</span><span class="s3">: </span><span class="s7">'深圳北'</span><span class="s3">,</span>
      <span class="s1">price</span><span class="s3">: </span><span class="s6">86</span>
    <span class="s2">}</span><span class="s3">,</span>
    <span class="s2">{</span>
      <span class="s1">id</span><span class="s3">: </span><span class="s6">2</span><span class="s3">,</span>
      <span class="s1">beginTime</span><span class="s3">: </span><span class="s7">'15:05'</span><span class="s3">,</span>
      <span class="s1">endTime</span><span class="s3">: </span><span class="s7">'16:09'</span><span class="s3">,</span>
      <span class="s1">totalTime</span><span class="s3">: </span><span class="s7">'1时4分'</span><span class="s3">,</span>
      <span class="s1">TNum</span><span class="s3">: </span><span class="s7">'G1185'</span><span class="s3">,</span>
      <span class="s1">beginStation</span><span class="s3">: </span><span class="s7">'广州东'</span><span class="s3">,</span>
      <span class="s1">endStation</span><span class="s3">: </span><span class="s7">'深圳'</span><span class="s3">,</span>
      <span class="s1">price</span><span class="s3">: </span><span class="s6">79.5</span>
    <span class="s2">}</span><span class="s3">,</span>
    <span class="s2">{</span>
      <span class="s1">id</span><span class="s3">: </span><span class="s6">3</span><span class="s3">,</span>
      <span class="s1">beginTime</span><span class="s3">: </span><span class="s7">'15:33'</span><span class="s3">,</span>
      <span class="s1">endTime</span><span class="s3">: </span><span class="s7">'16:09'</span><span class="s3">,</span>
      <span class="s1">totalTime</span><span class="s3">: </span><span class="s7">'36分'</span><span class="s3">,</span>
      <span class="s1">TNum</span><span class="s3">: </span><span class="s7">'G1187'</span><span class="s3">,</span>
      <span class="s1">beginStation</span><span class="s3">: </span><span class="s7">'新塘'</span><span class="s3">,</span>
      <span class="s1">endStation</span><span class="s3">: </span><span class="s7">'福田'</span><span class="s3">,</span>
      <span class="s1">price</span><span class="s3">: </span><span class="s6">70</span>
    <span class="s2">}</span><span class="s3">,</span>
    <span class="s2">{</span>
      <span class="s1">id</span><span class="s3">: </span><span class="s6">4</span><span class="s3">,</span>
      <span class="s1">beginTime</span><span class="s3">: </span><span class="s7">'16::44'</span><span class="s3">,</span>
      <span class="s1">endTime</span><span class="s3">: </span><span class="s7">'18:42'</span><span class="s3">,</span>
      <span class="s1">totalTime</span><span class="s3">: </span><span class="s7">'1时58分'</span><span class="s3">,</span>
      <span class="s1">TNum</span><span class="s3">: </span><span class="s7">'C6760'</span><span class="s3">,</span>
      <span class="s1">beginStation</span><span class="s3">: </span><span class="s7">'广州白云'</span><span class="s3">,</span>
      <span class="s1">endStation</span><span class="s3">: </span><span class="s7">'福海西'</span><span class="s3">,</span>
      <span class="s1">price</span><span class="s3">: </span><span class="s6">80</span>
    <span class="s2">}</span><span class="s3">,</span>
    <span class="s2">{</span>
      <span class="s1">id</span><span class="s3">: </span><span class="s6">5</span><span class="s3">,</span>
      <span class="s1">beginTime</span><span class="s3">: </span><span class="s7">'15:55'</span><span class="s3">,</span>
      <span class="s1">endTime</span><span class="s3">: </span><span class="s7">'17:51'</span><span class="s3">,</span>
      <span class="s1">totalTime</span><span class="s3">: </span><span class="s7">'1时56分'</span><span class="s3">,</span>
      <span class="s1">TNum</span><span class="s3">: </span><span class="s7">'C6705'</span><span class="s3">,</span>
      <span class="s1">beginStation</span><span class="s3">: </span><span class="s7">'广州'</span><span class="s3">,</span>
      <span class="s1">endStation</span><span class="s3">: </span><span class="s7">'深圳机场'</span><span class="s3">,</span>
      <span class="s1">price</span><span class="s3">: </span><span class="s6">78</span>
    <span class="s2">}</span><span class="s3">,</span>
    <span class="s2">{</span>
      <span class="s1">id</span><span class="s3">: </span><span class="s6">6</span><span class="s3">,</span>
      <span class="s1">beginTime</span><span class="s3">: </span><span class="s7">'20:34'</span><span class="s3">,</span>
      <span class="s1">endTime</span><span class="s3">: </span><span class="s7">'22:13'</span><span class="s3">,</span>
      <span class="s1">totalTime</span><span class="s3">: </span><span class="s7">'1时39分'</span><span class="s3">,</span>
      <span class="s1">TNum</span><span class="s3">: </span><span class="s7">'C6707'</span><span class="s3">,</span>
      <span class="s1">beginStation</span><span class="s3">: </span><span class="s7">'广州北'</span><span class="s3">,</span>
      <span class="s1">endStation</span><span class="s3">: </span><span class="s7">'沙井西'</span><span class="s3">,</span>
      <span class="s1">price</span><span class="s3">: </span><span class="s6">92.5</span>
    <span class="s2">}</span>
  <span class="s5">]</span>
  <span class="s0">// 默认使用完整的数据</span>
  <span class="s4">@</span><span class="s1">State list</span><span class="s3">: </span><span class="s1">iTicketData</span><span class="s5">[] </span><span class="s3">= </span><span class="s1">this</span><span class="s3">.</span><span class="s1">sourceData</span>
  <span class="s4">@</span><span class="s1">Watch</span><span class="s5">(</span><span class="s7">'fn'</span><span class="s5">)</span>
  <span class="s4">@</span><span class="s1">Prop keyWord</span><span class="s3">: </span><span class="s1">string</span><span class="s5">[] </span><span class="s3">= </span><span class="s5">[]</span>

  <span class="s1">fn</span><span class="s5">() </span><span class="s2">{</span>
    <span class="s1">if </span><span class="s5">(</span><span class="s1">this</span><span class="s3">.</span><span class="s1">keyWord</span><span class="s3">.</span><span class="s1">length </span><span class="s3">=== </span><span class="s6">0</span><span class="s5">) </span><span class="s2">{</span>
      <span class="s1">this</span><span class="s3">.</span><span class="s1">list </span><span class="s3">= </span><span class="s1">this</span><span class="s3">.</span><span class="s1">sourceData</span>
    <span class="s2">} </span><span class="s1">else </span><span class="s2">{</span>
      <span class="s1">this</span><span class="s3">.</span><span class="s1">list </span><span class="s3">= </span><span class="s1">this</span><span class="s3">.</span><span class="s1">sourceData</span><span class="s3">.</span><span class="s1">filter</span><span class="s5">((</span><span class="s1">item</span><span class="s3">: </span><span class="s1">iTicketData</span><span class="s5">) </span><span class="s3">=&gt; </span><span class="s2">{</span>
        <span class="s1">return this</span><span class="s3">.</span><span class="s1">keyWord</span><span class="s3">.</span><span class="s1">includes</span><span class="s5">(</span><span class="s1">item</span><span class="s3">.</span><span class="s1">beginStation</span><span class="s5">)</span>
      <span class="s2">}</span><span class="s5">)</span>
    <span class="s2">}</span>
  <span class="s2">}</span>

  <span class="s1">build</span><span class="s5">() </span><span class="s2">{</span>
    <span class="s1">List</span><span class="s5">() </span><span class="s2">{</span>
      <span class="s1">ForEach</span><span class="s5">(</span><span class="s1">this</span><span class="s3">.</span><span class="s1">list</span><span class="s3">, </span><span class="s5">(</span><span class="s1">item</span><span class="s3">: </span><span class="s1">iTicketData</span><span class="s3">, </span><span class="s1">index</span><span class="s3">: </span><span class="s1">number</span><span class="s5">) </span><span class="s3">=&gt; </span><span class="s2">{</span>
        <span class="s1">ListItem</span><span class="s5">() </span><span class="s2">{</span>
          <span class="s1">Column</span><span class="s5">() </span><span class="s2">{</span>
            <span class="s0">// 车票信息行</span>
            <span class="s1">Row</span><span class="s5">() </span><span class="s2">{</span>
              <span class="s0">// 其实时间和站点</span>
              <span class="s1">Column</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">space</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">) </span><span class="s2">{</span>
                <span class="s1">Text</span><span class="s5">(</span><span class="s1">item</span><span class="s3">.</span><span class="s1">beginTime</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">20</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontWeight</span><span class="s5">(</span><span class="s6">500</span><span class="s5">)</span>
                <span class="s1">Text</span><span class="s5">(</span><span class="s1">item</span><span class="s3">.</span><span class="s1">beginStation</span><span class="s5">)</span>
              <span class="s2">}</span>
              <span class="s3">.</span><span class="s1">layoutWeight</span><span class="s5">(</span><span class="s6">1</span><span class="s5">)</span>

              <span class="s0">// 车次和总用时</span>
              <span class="s1">Column</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">space</span><span class="s3">: </span><span class="s6">5 </span><span class="s2">}</span><span class="s5">) </span><span class="s2">{</span>
                <span class="s1">Text</span><span class="s5">(</span><span class="s1">item</span><span class="s3">.</span><span class="s1">TNum</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">20</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontWeight</span><span class="s5">(</span><span class="s6">500</span><span class="s5">)</span>
                <span class="s1">Divider</span><span class="s5">()</span>
                  <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s6">80</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">color</span><span class="s5">(</span><span class="s7">'rgba(0,0,0,0.4)'</span><span class="s5">)</span>
                <span class="s1">Text</span><span class="s5">(</span><span class="s1">item</span><span class="s3">.</span><span class="s1">totalTime</span><span class="s5">)</span>
              <span class="s2">}</span>
              <span class="s3">.</span><span class="s1">layoutWeight</span><span class="s5">(</span><span class="s6">1.5</span><span class="s5">)</span>

              <span class="s0">// 结束时间和终点站</span>
              <span class="s1">Column</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">space</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">) </span><span class="s2">{</span>
                <span class="s1">Text</span><span class="s5">(</span><span class="s1">item</span><span class="s3">.</span><span class="s1">endTime</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">20</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontWeight</span><span class="s5">(</span><span class="s6">500</span><span class="s5">)</span>
                <span class="s1">Text</span><span class="s5">(</span><span class="s1">item</span><span class="s3">.</span><span class="s1">endStation</span><span class="s5">)</span>
              <span class="s2">}</span>
              <span class="s3">.</span><span class="s1">layoutWeight</span><span class="s5">(</span><span class="s6">1</span><span class="s5">)</span>

              <span class="s0">// 票价</span>
              <span class="s1">Column</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">space</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">) </span><span class="s2">{</span>
                <span class="s1">Text</span><span class="s5">() </span><span class="s2">{</span>
                  <span class="s1">Span</span><span class="s5">(</span><span class="s7">'￥'</span><span class="s5">)</span>
                    <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">14</span><span class="s5">)</span>
                  <span class="s1">Span</span><span class="s5">(</span><span class="s1">item</span><span class="s3">.</span><span class="s1">price</span><span class="s3">.</span><span class="s1">toString</span><span class="s5">())</span>
                  <span class="s1">Span</span><span class="s5">(</span><span class="s7">'起'</span><span class="s5">)</span>
                    <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">15</span><span class="s5">)</span>
                <span class="s2">}</span>
                <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">20</span><span class="s5">)</span>
                <span class="s3">.</span><span class="s1">fontWeight</span><span class="s5">(</span><span class="s6">500</span><span class="s5">)</span>
                <span class="s3">.</span><span class="s1">fontColor</span><span class="s5">(</span><span class="s7">'#FF6600'</span><span class="s5">)</span>

                <span class="s1">Text</span><span class="s5">(</span><span class="s7">''</span><span class="s5">)</span>
              <span class="s2">}</span>
              <span class="s3">.</span><span class="s1">layoutWeight</span><span class="s5">(</span><span class="s6">1</span><span class="s5">)</span>
            <span class="s2">}</span>
            <span class="s3">.</span><span class="s1">height</span><span class="s5">(</span><span class="s6">100</span><span class="s5">)</span>
            <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s7">'100%'</span><span class="s5">)</span>

            <span class="s0">// 横线</span>
            <span class="s1">Divider</span><span class="s5">()</span>
              <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s7">'100%'</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">color</span><span class="s5">(</span><span class="s7">'rgba(0,0,0,0.4)'</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">padding</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">left</span><span class="s3">: </span><span class="s6">15</span><span class="s3">, </span><span class="s1">right</span><span class="s3">: </span><span class="s6">15 </span><span class="s2">}</span><span class="s5">)</span>

            <span class="s0">//  票数量行</span>
            <span class="s1">Flex</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">wrap</span><span class="s3">: </span><span class="s1">FlexWrap</span><span class="s3">.</span><span class="s1">Wrap </span><span class="s2">}</span><span class="s5">) </span><span class="s2">{</span>
              <span class="s1">Text</span><span class="s5">() </span><span class="s2">{</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">'二等'</span><span class="s5">)</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">' 6张'</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontColor</span><span class="s5">(</span><span class="s1">Color</span><span class="s3">.</span><span class="s1">Green</span><span class="s5">)</span>
              <span class="s2">}</span>
              <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">14</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s6">80</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">padding</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">top</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">)</span>

              <span class="s1">Text</span><span class="s5">() </span><span class="s2">{</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">'一等'</span><span class="s5">)</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">' 有票'</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontColor</span><span class="s5">(</span><span class="s1">Color</span><span class="s3">.</span><span class="s1">Green</span><span class="s5">)</span>
              <span class="s2">}</span>
              <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">14</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s6">80</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">padding</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">top</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">)</span>

              <span class="s1">Text</span><span class="s5">() </span><span class="s2">{</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">'特等'</span><span class="s5">)</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">' 有票'</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontColor</span><span class="s5">(</span><span class="s1">Color</span><span class="s3">.</span><span class="s1">Green</span><span class="s5">)</span>
              <span class="s2">}</span>
              <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">14</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s6">80</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">padding</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">top</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">)</span>

              <span class="s1">Text</span><span class="s5">() </span><span class="s2">{</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">'商务'</span><span class="s5">)</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">' 有票'</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontColor</span><span class="s5">(</span><span class="s1">Color</span><span class="s3">.</span><span class="s1">Green</span><span class="s5">)</span>
              <span class="s2">}</span>
              <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">14</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s6">80</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">padding</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">top</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">)</span>

              <span class="s1">Text</span><span class="s5">() </span><span class="s2">{</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">'无座'</span><span class="s5">)</span>
                <span class="s1">Span</span><span class="s5">(</span><span class="s7">' 有票'</span><span class="s5">)</span>
                  <span class="s3">.</span><span class="s1">fontColor</span><span class="s5">(</span><span class="s1">Color</span><span class="s3">.</span><span class="s1">Green</span><span class="s5">)</span>
              <span class="s2">}</span>
              <span class="s3">.</span><span class="s1">fontSize</span><span class="s5">(</span><span class="s6">14</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s6">80</span><span class="s5">)</span>
              <span class="s3">.</span><span class="s1">padding</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">top</span><span class="s3">: </span><span class="s6">10 </span><span class="s2">}</span><span class="s5">)</span>
            <span class="s2">}</span>
            <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s7">'100%'</span><span class="s5">)</span>
            <span class="s3">.</span><span class="s1">padding</span><span class="s5">(</span><span class="s2">{</span>
              <span class="s1">left</span><span class="s3">: </span><span class="s6">15</span><span class="s3">,</span>
              <span class="s1">right</span><span class="s3">: </span><span class="s6">15</span><span class="s3">,</span>
              <span class="s1">top</span><span class="s3">: </span><span class="s6">10</span><span class="s3">,</span>
              <span class="s1">bottom</span><span class="s3">: </span><span class="s6">10</span>
            <span class="s2">}</span><span class="s5">)</span>

          <span class="s2">}</span>
          <span class="s3">.</span><span class="s1">width</span><span class="s5">(</span><span class="s7">'100%'</span><span class="s5">)</span>
          <span class="s3">.</span><span class="s1">backgroundColor</span><span class="s5">(</span><span class="s1">Color</span><span class="s3">.</span><span class="s1">White</span><span class="s5">)</span>
          <span class="s3">.</span><span class="s1">border</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">width</span><span class="s3">: </span><span class="s6">1</span><span class="s3">, </span><span class="s1">color</span><span class="s3">: </span><span class="s7">'rgba(0,0,0,0.1)' </span><span class="s2">}</span><span class="s5">)</span>
          <span class="s3">.</span><span class="s1">borderRadius</span><span class="s5">(</span><span class="s6">10</span><span class="s5">)</span>
          <span class="s3">.</span><span class="s1">margin</span><span class="s5">(</span><span class="s2">{ </span><span class="s1">top</span><span class="s3">: </span><span class="s6">5 </span><span class="s2">}</span><span class="s5">)</span>
        <span class="s2">}</span>
      <span class="s2">}</span><span class="s5">)</span>
    <span class="s2">}</span>
    <span class="s3">.</span><span class="s1">padding</span><span class="s5">(</span><span class="s6">10</span><span class="s5">)</span>
    <span class="s3">.</span><span class="s1">scrollBar</span><span class="s5">(</span><span class="s1">BarState</span><span class="s3">.</span><span class="s1">Off</span><span class="s5">)</span>
  <span class="s2">}</span>
<span class="s2">}</span></pre>
</body>
</html>